<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>while循环</title>
</head>
<body>
<h3>while 循环</h3>

<h4>1. while 循环基本</h4>
<pre style="font-size: 20px;">
    while (循环条件) {
      要循环的代码(循环体)
    }
</pre>
<p>
释义： <br>
跟if语句很像，都要满足小括号里的条件为true才会进入 循环体 执行代码 <br>
while大括号里代码执行完毕后不会跳出，而是继续回到小括号里判断条件是否满足，若满足又执行大括号里的代码，然后再回到 <br>
小括号判断条件，直到括号内条件不满足，即跳出
</p>

<h4>2. while 循环三要素：</h4>
<p>
循环的本质就是以某个变量为起始值，然后不断产生变化量，慢慢靠近终止条件的过程。 <br>
所以，while循环需要具备三要素： <br>
1. 变量起始值 <br>
2. 终止条件（没有终止条件，循环会一直执行，造成死循环） <br>
3. 变量变化量（用自增或者自减）
</p>
<hr>

<script>
    // 1. 变量起始值
    let i = 1
    //2. 终止条件（没有终止条件，循环会一直执行，造成死循环
    while (i <= 3) {
      document.write('我要循环三次 <br>')
      i++ // 3. 变量的变化量
    }

    // 案例  计算1-100之间的所有偶数和
    let p = 1
    let 和 = 0
    while (p <= 100) {
        if (p % 2 === 0) { //取余是否是0, 判断是否是偶数
            和 = 和 + p
        }
        console.log(p) // 检查是否是到100, 浏览器-控制台查看信息
        p++
    }
    // 输出 和的值
    document.write(`1-100之间的所有偶数和是: ${和}`)
</script>
</body>
</html>